CSS [attribute = “value”] Selector
The [attribute = “value”] Selector selector is used to select all the elements whose attribute has the value exactly the same as the specified value.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Attribute selector</title>
<style>
[title="gfg"] {
color: green;
font-size: 40px;
font-weight: bold;
text-align: center;
}
[title="geeks"] {
font-size: 17px;
text-align: center;
margin-top: 0px;
}
</style>
</head>
<body>
<div title="gfg">w3wiki</div>
<p title="geeks">
A computer science portal for geeks
</p>
</body>
</html>
Output:
CSS Attribute Selector
The CSS Attribute Selector is a very useful approach that targets elements based on their specific attributes or attribute values. This allows for precise styling of HTML elements that share common attributes, enhancing the consistency and efficiency of your CSS code. Lets see how to work with CSS Attribute Selector.
Syntax:
[attribute]{
/* Styles*/
}
// OR
element [attribute] {
/* Styles*/
}
// OR
[attribute ="value "]
{
/* Styles*/
}
There are several types of attribute selectors which are discussed below:
Contact Us